/**
 * @author ccpalu
 */
function canvasWithTooltip(id,title,w,h,l,t,color,stroke,parent){
	var canvas = document.createElement('CANVAS');
	if (id)
		canvas.id=id;
	canvas.title=title;
	canvas.width=w;
	canvas.height=h;
	parent.appendChild(canvas);
	setPosition(canvas, l,t);
	var ctx = canvas.getContext("2d");
	if (color) {
		ctx.fillStyle = color;
		ctx.fillRect(0, 0, w, h);
	}
	if (stroke) {
		ctx.strokeStyle = stroke;
		ctx.stroke();
	}

	return canvas;
}

function labelChart(index,x){
	var chart = document.createElement("div");
	graphicAreaVariables();
	
	chart.id = "chartLabel2";
	document.getElementById('chartingArea').appendChild(chart);
	chart.style.position='absolute';
	chart.style.width = "45px";
	chart.style.height = graphicVariables.generalHeight()+ "px";
	chart.style.top = graphicVariables.top+"px";
	chart.style.left = graphicVariables.clinicalLeft()+graphicVariables.clinicalWidth()+'px';
	chart.style.zIndex=-21;

	for (var i=0; i<index.length;i=i+1){
		canvasWithTooltip('label'+ index[i], index[i],7,graphicVariables.segmentHeight-1,0,i*5+0.5, '#aed2dd','#519fb7', chart);	
	}

	return false;
}
